<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        input {
            display: block;
            margin-bottom: 10px;
        }
    </style>
</head>

<body>
    <!-- 
        题目要求: 有一组文本框，要求让每一个文本框在自己输入的时候，背景显示灰色，其他文本框显示白色。
     -->
    <input type="text">
    <input type="text">
    <input type="text">
    <input type="text">
    <input type="text">

    <script>
        // 获取元素
        var ipt = document.getElementsByTagName('input');

        for (var i = 0; i < ipt.length; i++) {
            // 给每一个input框添加焦点事件
            ipt[i].onfocus = function() {
                // 遍历数组
                for (var j = 0; j < ipt.length; j++) {
                    // 排除其他:将包含自己的所有项都设为默认样式
                    ipt[j].style.backgroundColor = '';
                }
                //保留自己:给自己单独设置特殊样式
                this.style.backgroundColor = 'gray'
            }
        }
    </script>
</body>

</html>